	<p>
		<button id="create-client-button">Criar Cliente</button>	
	</p>
	
	<p>
		  <button id="tmpButton">temp action</button>	
	</p>
	
	<?php 
		// load form to be shown with jqueryui dialog
		echo $template['partials']['clientForm'];
	?>	
	
	<?php
		echo "Lista de clientes: ";
	?>
	
	<table id="clientTable" class="display">
		<thead>
			<tr>
				<th>Nome</th>
				<th>Morada</th>
				<th>eMail</th>
				<th>Telefone</th>
				<th>Data Nascimento</th>
			</tr>
		</thead>
	<tbody>
			
	</tbody>
	</table>	
	
	<script>

	
		$(document).ready(function() {

			var serverRequest = window.ajaxUrl + '/readClientAction';

			// define datatable options 
			var tableProperties = {
				'sAjaxSource': 		serverRequest,	
				'sServerMethod':	'POST',
				'sAjaxDataProp': 	'data',
				'fnServerParams': 	function (aoData) {
						aoData.push( {'var1':'value1','var2':'value2'});
				},
				"aoColumns": [
					{"mDataProp":"name"},
					{"mDataProp":"address"},
					{"mDataProp":"email"},
					{"mDataProp":"phone"},
					{"mDataProp":"birthday"}
				],
				'bJQueryUI':		true,	// enable jqueryUI Themes
				'bPaginate':		true,
				'bSort':			true,
				'bInfo':			true,
				'bAutoWidth':		true,
				'bProcessing': 		true,
				'bServerSide': 		false,	// use server side processing
				'oLanguage': {
					'sInfo':		'registos _START_ até ao _END_ de _TOTAL_',
					'sZeroRecords': 'Não existem registos',
					'sSearch':		'Procurar',
					'sLengthMenu':	'Mostrar <select>' +
						'<option value="10">10</option>'+
				        '<option value="20">20</option>'+
				        '<option value="30">30</option>'+
				        '<option value="40">40</option>'+
				        '<option value="50">50</option>'+
				        '<option value="-1">Todos</option>'+
				        '</select> registos'
				}	
			};

			// set datatable options
			$('#clientTable').dataTable(tableProperties);

			// add events to clientTable
			$('#clientTable tbody tr').live('click', function() {
				var nTds = $('td', this);
				var col1 = $(nTds[0]).text();
				var col2 = $(nTds[1]).text();
				
				console.log(col1);
			});



			
			$('#tmpButton').on('click', function() {
				//var tmp = $('#clientTable').dataTable();
				//tmp.fnClearTable();
				//tmp.fnDraw();
				//clientTable.fnReloadAjax();
				//console.log(tmp);
				//console.log('tmpbutton');
			});
				
		});



			
	</script>
	
	
	<div id="dialog" title="simple dialog" class="dialog">this is a dialog</div>
	
<script>

	

	
	
</script>
	
	
	
	